<template>
	<view class="container">
		<painter style="position:fixed;top:-9999rpx" :palette="template" @imgErr="imgErr" @imgOK="onImgOK" />
		<view class="tui-flex">
			<view class="tui-center tui-col-12" style="margin-top: 10px;"><image :style="{ height: screenHeight * 0.7 + 'px' }" :src="imagePath" mode="aspectFit"></image></view>
		</view>
		<view class="tui-btn-box"><button class="btn-primary" hover-class="btn-hover" @tap="saveImage" type="primary">保存图片</button></view>
	</view>
</template>

<script>
// import Card from '@/utils/card.js';
export default {
	data() {
		return {
			screenHeight: '',
			template: '',
			imagePath: '',
			type:'share',
			dataId:''
		};
	},
	computed: {},
	onLoad(e) {
		this.initData();
		// 腾讯移动统计
		this.$mta.Page.init();
		
		if(e.type){
			this.type=e.type;
		}
		if(e.dataId){
			this.dataId=e.dataId;
		}
		this.getRecomPosterPsd(this.type);
		uni.getSystemInfo({
			//获取设备信息
			success: res => {
				this.screenHeight = res.screenHeight;
			}
		});
	},
	methods: {
		getRecomPosterPsd(type) {
			let url="/api/poster/getRecomPosterPsd.short";
			if(type=='share'){
				url="/api/poster/getRecomPosterPsd.short";
			}else if(type=='note'){
				url="/api/poster/getNotePosterPsd.short";
			}else if(type=='mer'){
				url="/api/poster/getMerPosterPsd.short";
			}else if(type=='coupon'){
				url="/api/poster/getCouponPosterPsd.short";
			}
			url=url+"?type="+type+"&dataId="+this.dataId;
			let postData = {};
			this.tui
				.request(url, postData, 'POST', false, true)
				.then(res => {
					if (res.code == 0) {
						this.template = JSON.parse(res.data.psd);
					} else {
						this.tui.toast(res.msg);
						uni.hideLoading();
					}
				})
				.catch(res => {
					uni.hideLoading();
					console.log(res);
				});
		},
		initData() {
			uni.showLoading({
				title: '拼命生成中...',
				mask: true
			});
			// this.template = new Card().palette();
			// this.getActPosterPsd();
		},
		onImgOK(e) {
			this.imagePath = e.detail.path;
			uni.hideLoading();
		},
		imgErr(e) {
			uni.hideLoading();
			uni.showModal({
				title: '提示',
				content: '生成海报失败',
				showCancel: false
			});
			console.log(e);
		},
		saveImage() {
			//长按保存
			var _this = this;
			uni.authorize({
				scope: 'scope.writePhotosAlbum',
				success(res2) {
					// console.log(JSON.stringify(res2));
					uni.saveImageToPhotosAlbum({
						filePath: _this.imagePath,
						success(res) {
							// console.log(JSON.stringify(res));
							uni.showModal({
								title: '保存成功',
								content: '保存到相册成功，快去分享到您的朋友圈',
								showCancel: false
							});
						}
					});
				}
			});
		}
	}
};
</script>

<style scoped>
@import '../../static/style/thorui.css';
.tui-btn-box {
	padding: 20rpx 160rpx;
	box-sizing: border-box;
}
.img {
	border: 8px solid #fff;
}
</style>
